<div style="position: absolute;top: 120px; left: 450px">
    <font style="font-size: 25px ;color: #e8198b">收支查询：</font>&nbsp;&nbsp;
    单据编号：<input type="text" class="su" id="orderCode" >&nbsp;
    收支类型:<select id="pay_type" style="border-radius: 50px;
    height: 20px;
    border-color: #0eb4dd; background-color: rgba(62,181,174,0.71)">
    <option value="1">收入</option>
    <option value="-1">支出</option>
</select>
    日期范围：<input type="text" class="su" id="timeRange">

    <input type="button" value="查询" onclick="selectPayRecord()" style="background-color: #1E9FFF">

</div>


<br>
<table class="altrowstable">
    <tr>
        <td>编号</td>
        <td>收付款时间</td>
        <td>收付款金额</td>
        <td>经手人</td>
        <td>相关单据号</td>
        <td>收付款类型</td>
    </tr>
    <tbody id="payRe">

    </tbody>
    <div  style="position: absolute; margin-top: 0px;padding-left: 700px">
        <ul id="page">分页</ul>
    </div>
</table>


<script type="text/html" id="record">
    {{each data}}
    <tr>
        <td>{{$index+1}}</td>
        <td>{{$value.pay_time}}</td>
        <td>{{$value.pay_price}}</td>
        <td>{{$value.account}}</td>
        <td>{{$value.orderCode}}</td>
        <td>{{$value.pay_type}}</td>
    </tr>
    {{/each}}
</script>
<script type="text/javascript">

    function selectPayRecord(){
        showPage({
            currentPage: 1,
            pageSize: 3,
            url:'selectPayRecord',
            templateId: 'record',
            contentId: 'payRe',
            params:{
                pay_type:$('#pay_type').find("option:selected").val(),
                time:$('#timeRange').val(),
                orderCode:$('#orderCode').val()
            }
        })
    }


    $(function () {
        showPage({
            currentPage: 1,
            pageSize: 3,
            url: '/getAllPayRecord',
            templateId: 'record',
            contentId: 'payRe',
        })
    });




    laydate.render({
        elem: '#timeRange'

        ,range: "~"
    });
</script>